﻿<script setup lang="ts" name="DrawerWrap">
const visible = ref(false)
const title = ref('')
const showDrawer = (v) => {
  visible.value = true
  title.value = v.title
}
// 子组件将方法暴露给父组件
defineExpose({ showDrawer })
</script>

<template>
  <el-drawer class="designer-drawer" v-model="visible" direction="rtl">
    <template #header>
      <h2>{{title}}</h2>
    </template>
    <template #default>
      <el-scrollbar>
        <slot />
      </el-scrollbar>
    </template>
    <template #footer>
      <div style="flex: auto">
        <el-button @click="visible = false">取消</el-button>
        <el-button type="primary" @click="visible = false">确认</el-button>
      </div>
    </template>
  </el-drawer>
</template>

<style lang="scss"></style>
